<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>登录</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="../assets/css/semantic.min.css"/>
    <style>
        *{
            font-family: "microsoft yahei";
        }
    </style>
    <script src="../assets/js/jquery.min.js"></script>
    <script src="../assets/js/semantic.min.js"></script>
    <script>
        $(function(){
            $('.ui.form').form({
                name: {
                    identifier : 'name',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : '请输入用户名'
                        }
                    ]
                },
                password: {
                    identifier : 'password',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : '请输入密码'
                        },
                        {
                            type   : 'length[6]',
                            prompt : '密码至少六位'
                        }
                    ]
                }
            });
            $('.ui.checkbox').checkbox();
        });
    </script>
</head>
<body class="ui grid page">
    <main class="column" style="width: 100%">
        <form class="ui form segment" method="POST" action="/sessions/login">
            <lengend class="ui header">登录blog</lengend>
            <p style="color: red" th:text="${error}"></p>
            <fieldset>
                <div class="field">
                    <label>用户名</label>
                    <div class="ui left labeled icon input">
                        <input type="text" name="name" placeholder="用户名"/>
                        <i class="user icon"></i>
                        <div class="ui corner label">
                            <i class="icon asterisk"></i>
                        </div>
                    </div>
                </div>
                <div class="field">
                    <label>密码</label>
                    <div class="ui left labeled icon input">
                        <input type="password" name="password" placeholder="密码"/>
                        <i class="lock icon"></i>
                        <div class="ui corner label">
                            <i class="icon asterisk"></i>
                        </div>
                    </div>
                </div>
                <div class="ui error message"></div>
                <div class="ui buttons">
                    <div class="ui positive submit button">登录</div>
                    <div class="or"></div>
                    <a class="ui blue button" href="/sessions/signup">注册</a>
                </div>
            </fieldset>
        </form>
    </main>
</body>
</html>